<script>
export default {
  name: "Resources"
}
</script>

<template>
  <div style="margin-left: 100px" class="main ">
    <h1 style="margin-left: 100px">学习</h1>
    <div class="container">
      <div class="item">
        <a href="https://www.electronjs.org/" target="_blank">
          <img src="https://www.electronjs.org/assets/img/logo.svg" alt="Logo">
        </a>
        <span>Electron</span>
      </div>
      <div class="item">
        <a href="https://github.com/" target="_blank">
          <img src="../../assets/resources/github.png" alt="Logo">
        </a>
        <span>GitHub</span>
      </div>
      <div class="item">
        <a href="https://www.electronjs.org/" target="_blank">
          <img src="https://developer.mozilla.org/favicon-192x192.png" alt="Logo">
        </a>
        <span>MDN</span>
      </div>

      <div class="item">
        <a href="https://zh-hans.react.dev/" target="_blank">
          <img src="../../assets/resources/React.png" alt="Logo">
        </a>
        <span>React</span>
      </div>

      <div class="item">
        <a href="https://gitee.com/" target="_blank">
          <img src="https://gitee.com/favicon.ico" alt="Logo">
        </a>
        <span>Gitee</span>
      </div>

      <div class="item">
        <a href="https://www.csdn.net/" target="_blank">
          <img src="../../assets/resources/csdn.png" alt="Logo">
        </a>
        <span>CSDN</span>
      </div>

      <div class="item">
        <a href="https://www.w3school.com.cn/" target="_blank">
          <img src="../../assets/resources/w3school.png" alt="Logo">
        </a>
        <span>W3SCHOOL</span>
      </div>

      <div class="item">
        <a href="https://apifox.com/?utm_source=a1&utm_medium=a1itabweb" target="_blank">
          <img src="https://cdn.apifox.com/static/logo/favicon.ico" alt="Logo">
        </a>
        <span>Apifox</span>
      </div>

      <div class="item">
        <a href="https://typescript.bootcss.com/" target="_blank">
          <img src="../../assets/resources/typescript.png" alt="Logo">
        </a>
        <span>TypeScript</span>
      </div>

      <div class="item">
        <a href="https://juejin.cn/" target="_blank">
          <img src="https://lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web/6c61ae65d1c41ae8221a670fa32d05aa.svg"
               alt="Logo">
        </a>
        <span>稀土掘金</span>
      </div>

      <div class="item">
        <a href="https://www.zhihu.com/" target="_blank">
          <img src="../../assets/resources/zhihu.png" alt="Logo">
        </a>
        <span>知乎</span>
      </div>

      <div class="item">
        <a href="https://www.36kr.com/" target="_blank">
          <img src="../../assets/resources/36Kr.png" alt="Logo">
        </a>
        <span>36氪</span>
      </div>

      <div class="item">
        <a href="https://leetcode.cn/" target="_blank">
          <img src="../../assets/resources/leetcode.png" alt="Logo">
        </a>
        <span>力扣</span>
      </div>

      <div class="item">
        <a href="https://vitejs.dev/" target="_blank">
          <img src="https://vitejs.dev/logo.svg" alt="Logo">
        </a>
        <span>Vite</span>
      </div>

      <div class="item">
        <a href="https://cn.vuejs.org/" target="_blank">
          <img src="https://cn.vuejs.org/logo.svg" alt="Logo">
        </a>
        <span>Vue</span>
      </div>

      <div class="item">
        <a href="https://arco.design/" target="_blank">
          <img src="https://unpkg.byted-static.com/latest/byted/arco-config/assets/favicon.ico" alt="Logo">
        </a>
        <span>Arco Design</span>
      </div>

      <div class="item">
        <a href="https://flutter.cn/" target="_blank">
          <img src="../../assets/resources/flutter.png" alt="Logo">
        </a>
        <span>Flutter</span>
      </div>

      <div class="item">
        <a href="https://arco.design/" target="_blank">
          <img src="https://unpkg.byted-static.com/latest/byted/arco-config/assets/favicon.ico" alt="Logo">
        </a>
        <span>Arco Design</span>
      </div>

      <div class="item">
        <a href="https://element.eleme.cn/#/zh-CN" target="_blank">
          <img src="../../assets/resources/element.png" alt="Logo">
        </a>
        <span>Element-ui</span>
      </div>

      <div class="item">
        <a href="https://www.qiniu.com/?cps_key=1hk4r1ha80spe" target="_blank">
          <img src="../../assets/resources/qiniuyun.png" alt="Logo">
        </a>
        <span>七牛云存储</span>
      </div>

      <div class="item">
        <a href="https://www.oschina.net/" target="_blank">
          <img src="../../assets/resources/kyChina.png" alt="Logo">
        </a>
        <span>开源中国</span>
      </div>

      <div class="item">
        <a href="https://uniapp.dcloud.net.cn/collocation/pages.html" target="_blank">
          <img src="../../assets/resources/uni-app.png" alt="Logo">
        </a>
        <span>Uni-app</span>
      </div>

      <div class="item">
        <a href="https://www.asiayun.com/" target="_blank">
          <img src="../../assets/resources/cloud.png" alt="Logo">
        </a>
        <span>亚云</span>
      </div>

      <div class="item">
        <a href="https://time.geekbang.org/?utm_term=iTab&utm_source=iTab&utm_medium=iTab&utm_campaign=iTab&utm_content=iTab"
           target="_blank">
          <img src="../../assets/resources/jike.png" alt="Logo">
        </a>
        <span>极客时间</span>
      </div>

      <div class="item">
        <a href="https://kaifa.baidu.com/" target="_blank">
          <img src="https://kaifa.baidu.com/images/logo.png" alt="Logo">
        </a>
        <span>开发者搜索</span>
      </div>

      <div class="item">
        <a href="https://www.allhistory.com/" target="_blank">
          <img src="../../assets/resources/history.png" alt="Logo">
        </a>
        <span>全历史</span>
      </div>

    </div>
    <h1 style="margin-left: 100px">工具</h1>
    <div class="container">
      <div class="item">
        <a href="https://www.iconfont.cn/" target="_blank">
          <img src="../../assets/resources/icon.png" alt="Logo">
        </a>
        <span>iconfont</span>
      </div>
      <div class="item">
        <a href="https://u.tools/?from=itab" target="_blank">
          <img src="../../assets/resources/utools.png" alt="Logo">
        </a>
        <span>uTools</span>
      </div>
      <div class="item">
        <a href="https://xiezuocat.com/?s=itab" target="_blank">
          <img src="https://uranus-static.oss-accelerate.aliyuncs.com/xiezuocat/favicon.ico" alt="Logo">
        </a>
        <span>秘塔写作猫</span>
      </div>

      <div class="item">
        <a href="https://shimo.im/loginByCode?redirect_url=https%3A%2F%2Fshimo.im%2Fdesktop" target="_blank">
          <img src="../../assets/resources/shimo.png" alt="Logo">
        </a>
        <span>石墨文档</span>
      </div>

      <div class="item">
        <a href="https://www.huaweicloud.com/" target="_blank">
          <img src="../../assets/resources/huaweiyun.png" alt="Logo">
        </a>
        <span>华为云</span>
      </div>

      <div class="item">
        <a href="https://cn.aliyun.com/" target="_blank">
          <img src="../../assets/resources/aliyun.png" alt="Logo">
        </a>
        <span>阿里云</span>
      </div>

      <div class="item">
        <a href="https://fanyi.youdao.com/#/" target="_blank">
          <img src="../../assets/resources/youdao.png" alt="Logo">
        </a>
        <span>有道翻译</span>
      </div>

      <div class="item">
        <a href="https://translate.volcengine.com/" target="_blank">
          <img src="../../assets/resources/huoshanfanyi.png" alt="Logo">
        </a>
        <span>火山翻译</span>
      </div>

      <div class="item">
        <a href="https://www.apipost.cn/?utm_source=10147" target="_blank">
          <img src="../../assets/resources/apipost.png" alt="Logo">
        </a>
        <span>apipost</span>
      </div>

      <div class="item">
        <a href="https://www.runoob.com/" target="_blank">
          <img src="../../assets/resources/birdStudy.png" alt="Logo">
        </a>
        <span>菜鸟教程</span>
      </div>

      <div class="item">
        <a href="https://js.design/community?category=design&source=itab&plan=4" target="_blank">
          <img src="../../assets/resources/jishisheji.png" alt="Logo">
        </a>
        <span>即时设计</span>
      </div>

      <div class="item">
        <a href="https://huaban.com/" target="_blank">
          <img src="../../assets/resources/huaban.png" alt="Logo">
        </a>
        <span>花瓣</span>
      </div>

      <div class="item">
        <a href="https://www.zcool.com.cn/" target="_blank">
          <img src="../../assets/resources/zhanku.png" alt="Logo">
        </a>
        <span>站酷</span>
      </div>

      <div class="item">
        <a href="https://www.uisdc.com/" target="_blank">
          <img src="../../assets/resources/youshe.png" alt="Logo">
        </a>
        <span>优设</span>
      </div>

      <div class="item">
        <a href="https://www.qijishow.com/Brand/Brand23/index.htm" target="_blank">
          <img src="../../assets/resources/pencil.png" alt="Logo">
        </a>
        <span>绘画艺术</span>
      </div>

      <div class="item">
        <a href="https://www.skypixel.com/" target="_blank">
          <img src="../../assets/resources/kong.png" alt="Logo">
        </a>
        <span>天空之城</span>
      </div>

      <div class="item">
        <a href="https://www.bigbigwork.com/" target="_blank">
          <img src="../../assets/resources/dazuo.png" alt="Logo">
        </a>
        <span>大作网</span>
      </div>

      <div class="item">
        <a href="https://www.btbat.com/" target="_blank">
          <img src="../../assets/resources/R.png" alt="Logo">
        </a>
        <span>R站</span>
      </div>

      <div class="item">
        <a href="https://www.nipic.com/index.html" target="_blank">
          <img src="../../assets/resources/nitu.png" alt="Logo">
        </a>
        <span>昵图网</span>
      </div>

      <div class="item">
        <a href="https://www.nipic.com/index.html" target="_blank">
          <img src="../../assets/resources/kuque.png" alt="Logo">
        </a>
        <span>酷雀</span>
      </div>

      <div class="item">
        <a href="https://www.91sotu.com/" target="_blank">
          <img src="../../assets/resources/soutudaohang.png" alt="Logo">
        </a>
        <span>搜图导航</span>
      </div>

      <div class="item">
        <a href="https://www.58pic.com/" target="_blank">
          <img src="../../assets/resources/qiantu.png" alt="Logo">
        </a>
        <span>千图网</span>
      </div>

      <div class="item">
        <a href="https://www.gaoding.com/ai/material?hmsr=itab-itab-itab--itab-itab-bdqd&enter_name=jhy&utm_medium=itab&utm_source=itab"
           target="_blank">
          <img src="../../assets/resources/gaodingsheji.png" alt="Logo">
        </a>
        <span>稿定设计</span>
      </div>

      <div class="item">
        <a href="https://www.ui.cn/" target="_blank">
          <img src="../../assets/resources/uiChina.png" alt="Logo">
        </a>
        <span>Ui中国</span>
      </div>

      <div class="item">
        <a href="https://xinghuo.xfyun.cn/desk" target="_blank">
          <img src="../../assets/resources/xinghuo.png" alt="Logo">
        </a>
        <span>星火大模型</span>
      </div>

      <div class="item">
        <a href="https://kimi.moonshot.cn/chat/%7Ccnu2dahrdijchcjad2dg?index=1&tu=l" target="_blank">
          <img src="../../assets/resources/kimi.png" alt="Logo">
        </a>
        <span>Kimi</span>
      </div>
    </div>

    <h1 style="margin-left: 100px">娱乐</h1>
    <div class="container">
      <div class="item">
        <a href="https://weibo.com/newlogin?tabtype=weibo&gid=102803&openLoginLayer=0&url=https%3A%2F%2Fweibo.com%2F"
           target="_blank">
          <img src="../../assets/resources/xinlangweibo.png" alt="Logo">
        </a>
        <span>新浪微博</span>
      </div>


      <div class="item">
        <a href="https://www.iqiyi.com/?fv=8648154ddd63e0af" target="_blank">
          <img src="../../assets/resources/iqiyi.png" alt="Logo">
        </a>
        <span>爱奇艺</span>
      </div>

      <div class="item">
        <a href="https://www.youku.com/" target="_blank">
          <img src="../../assets/resources/youku.png" alt="Logo">
        </a>
        <span>优酷视频</span>
      </div>

      <div class="item">
        <a href="https://v.qq.com/" target="_blank">
          <img src="../../assets/resources/tengxun.png" alt="Logo">
        </a>
        <span>腾讯视频</span>
      </div>

      <div class="item">
        <a href="https://www.mgtv.com/" target="_blank">
          <img src="../../assets/resources/mangguo.png" alt="Logo">
        </a>
        <span>芒果TV</span>
      </div>

      <div class="item">
        <a href="https://y.qq.com/" target="_blank">
          <img src="../../assets/resources/QQmusic.png" alt="Logo">
        </a>
        <span>qq音乐</span>
      </div>

      <div class="item">
        <a href="https://music.163.com/?from=itab" target="_blank">
          <img src="../../assets/resources/tengxun.png" alt="Logo">
        </a>
        <span>网易云音乐</span>
      </div>

      <div class="item">
        <a href="https://bd.kuwo.cn/" target="_blank">
          <img src="../../assets/resources/kuwoyinyue.png" alt="Logo">
        </a>
        <span>酷我音乐</span>
      </div>

      <div class="item">
        <a href="https://www.kugou.com/" target="_blank">
          <img src="../../assets/resources/kugouyinyue.png" alt="Logo">
        </a>
        <span>酷狗音乐</span>
      </div>
    </div>
  </div>
</template>

<style scoped>
.container {
  background-color: #fff;
  height: 100%;
  width: 1220px;
  margin-left: 100px;
  position: relative; /* 让容器相对定位 */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 10px;
}

img {
  width: 80px;
  height: 80px;
  border-radius: 10px;
  margin-top: 10px;
  margin-left: 10px;
}

.item {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 15px;
  cursor: pointer;
}

span {
  font-size: 16px; /* Adjust the text size as needed */
  margin-top: 8px;
}
</style>